<!--
 * @Author: WLang
 * @LastEditors: WLang
 * @Description: 
 * @Date: 2023-07-14 17:00:28
 * @LastEditTime: 2023-07-19 16:05:37
 * @FilePath: \myblog\src\mviews\components\DialogBar.vue
-->
<template>
  <div class="blogm-dialog">
    <van-dialog v-model="show" title="登录" :beforeClose="beforeClose" show-cancel-button>
      <BaseForm ref="formWrap" :type="type"/>
      <p class="blogm-dialog--register">
        首次使用？<van-tag type="primary" plain @click="gotoUser">点我注册</van-tag>
      </p>
    </van-dialog>
  </div>
</template>

<script>
import BaseForm from '@/mviews/components/BaseForm.vue'
export default {
  components:{
    BaseForm
  },
  data(){
    return {
      show: false,
      type: '',
    }
  },
created(){},
mounted(){
  this.$EventBus.$on('openShow', (type)=> {
    this.show = true;
    this.type = type;
  })
},
beforeDestroy() {
  this.$EventBus.$off('openShow', (type)=> {
    this.show = true;
    this.type = type;
  })
},
watch:{

},
computed:{

},
methods:{
  gotoUser() {
    this.$router.push({name:'mUser', query:{state:'register'}});
    this.show = false;
  },
  beforeClose(action, done) {
    if (action === 'confirm')
    {
      let formWrap = this.$refs.formWrap;
      let formData = formWrap.$refs.form;
      formData.validate().then(
        async() => {
          try{
            await this.$api({type: this.type, data: formWrap.form})
            done();
          }
          catch(err) {
            //重置表单
            formData.resetValidation();
          }
        }
      ).catch(err => {
        done(false);
      })
    }
    else
    {
      done();
    }
  }
},
}
</script>
<style lang="scss" scoped>
 .blogm-dialog--register {
  text-align: center;
  padding: 10px 0;
 }
</style>